<!DOCTYPE html>
<html>

<head>
    <title>提现</title>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_50753_3hipdt989v6.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css">
    <link rel="stylesheet" type="text/css" href="../css/animate.css">
    <link rel="stylesheet" type="text/css" href="css/style.css?id=1">
    <script src="../js/jquery.js"></script>
    <script src="../js/flexible.js"></script>
    <style>
body{ padding-top: .9rem;}
.bg{height: 2.8rem; background: #5c9cff;}
.fxbox{box-shadow: 0 0 12px rgba(229, 229, 229, 0.8);border-radius: .1rem; background: #fff; 
    margin:0 .4rem;position: relative; padding: .3rem 0; margin-top: .4rem;}
.box1 { padding: .3rem; position: relative;border-bottom:1px solid #e5e5e5;}
.box1 .tx img{width: 1.4rem;height: 1.4rem;border-radius: 50%; position: absolute;right:.4rem;top: -60%; border: 2px solid #fff;}
.box1 .name{font-size: .32rem;}
.box1 .parent{ color: #999;font-size: .24rem;}
.tixian{ background: #8e85fc;border-radius: .1rem; margin: .3rem;color: #fff;position: relative; border-bottom: none; 
    margin-bottom: .2rem; margin-top: .2rem;}
.tx_box{position: absolute; right: .4rem;top:.6rem;}
.tx_box a{border-radius: .4rem;font-size: .24rem; background: #fff; display: block; text-align: center; height: .5rem; line-height: .5rem;color: #8e85fc; padding: 0 .3rem;}
.yitixian{display: flex; justify-content: space-between; padding: 0 .3rem;}
.fxbox1{ margin-top: .5rem; padding-bottom: 0;}
.reg_box{padding:0 .3rem}
.reg_box ul li{position:relative;display:flex;border:1px solid #EEE;margin-bottom:.2rem; padding: .1rem 0;align-items: center; padding-left: .2rem;}
.reg_box ul li input{margin-left:.1rem;height:.6rem;line-height:.6rem;border:none;width: 90%;}
.fxbox .tit{ padding:0 .3rem .3rem;position: relative;display: flex;align-items: center;}
.fxbox .tit::before{content: ''; width: .4rem; height: .4rem; margin-right: .1rem; background: url('images/unchecked.png') center no-repeat;
background-size: contain;}
.fxbox .tit.on::before{background: url('images/checked.png') center no-repeat;
background-size: contain;}
.btn_box{ padding: .3rem;}
.btn_default{background: #796bff;border:none;}
    </style>
</head>

<body>
    <div class="header">
        <div class="left"><i class="iconfont icon-fanhui1" onClick="javascript:history.back(-1)"></i></div>
        <div class="middle">提现</div>
        <div class="right"></div>
    </div>
    <div class="fxbox">

        <div class="box1 tixian">
            <div class="ketixian mb10">可提现：2500.00元</div>
            <div class="daitixian">待结算：1500.00元</div>
            <div class="tx_box"><a href="javacript:void(0);" class="tx_btn">总收益 288588元</a></div>
        </div>
        <div class="yitixian">
            <div class="left">已提现金额</div>
            <div class="left">188.5元</div>
        </div>
    </div>


    <div class="fxbox" id="fangshi">
        <div class="reg_box">
            <ul>
                <li>提现金额：
                    <input type="number" placeholder="提现金额最低100元起" maxlength="10" autofocus style="width:70%;">
                </li>
            </ul>
        </div>
        <div class="tit on" index="1">支付宝</div>
        <div class="reg_box fangshi1">
            <ul>
                <li>
                    <input type="text" placeholder="请输入姓名" maxlength="20">
                </li>

                <li>
                    <input type="text" placeholder="请输入支付宝账号" maxlength="80">
                </li>
            </ul>
        </div>
        <div class="tit" index="2">银行卡</div>
        <div class="reg_box fangshi2" style="display:none">
            <ul>
                <li>
                    <input type="text" placeholder="请输入姓名" maxlength="20">
                </li>

                <li>
                    <input type="text" placeholder="请输入开户行名称/地址" maxlength="200">
                </li>
                <li>
                    <input type="text" placeholder="请输入银行卡号" maxlength="80">
                </li>
            </ul>
        </div>
        <div class="btn_box mt10"><a href="javacript:void(0);" class="btn_default">提交申请</a></div>
    </div>
    </div>
</body>
<script>
    $('#fangshi .tit').click(function () {
        var index = $(this).attr('index');
        $(this).addClass('on').siblings().removeClass('on');
        if (index == 1) {
            $('.fangshi1').show();
            $('.fangshi2').hide();
        } else {
            $('.fangshi1').hide();
            $('.fangshi2').show();
        }
    })
</script>

</html>